<#include "/common/_layout.ftl"/>
<@layout>
<ul id="tt" class="easyui-tree">
	<#if menulist?? >
			<#list menulist as node>
				<#if node.attributes?? && node.attributes.url??>
				<li data-options="attributes:{'url':'${node.attributes.url}'}">
				<#else>
				<li>
				</#if>
					<span>${node.text}</span>
					<#if node.children??>
					<ul>
						<#list node.children as child>						
							<#if child.attributes?? && child.attributes.url?? >
							<li data-options="attributes:{'url':'${child.attributes.url}'}"><span>${child.text}</span></li>
							<#else>
							<li><span>${child.text}</span></li>
							</#if>						
						</#list>
					</ul>	
					</#if>
				</li>	
			</#list>
		</#if>
</ul>
<script type="text/javascript">
	$(function() {
		$('#tt').tree({
			onClick : function(node) {
				if(node.attributes != undefined && node.attributes.url != undefined && node.attributes.url != "#"){
					var url = "${request.contextPath}/"+node.attributes.url;					
					addMainTab(node.text,url);
				}
			}
		});
	});

	function addMainTab(text, url) {
		var mainTabs = $("#mainTabs");
		if(!mainTabs.tabs("exists", text)) {
			mainTabs.tabs('add',{
	            title: text,
	            content:'<iframe src="' + url + '" class="easyui-panel" data-options="fit:true,border:false" frameborder="0"></iframe>',
	            closable:true
	        });
	    }else {
	    	mainTabs.tabs("select", text);
	    	mainTabs.tabs('getSelected').panel('panel').find('iframe').attr("src", url)
	    }
	}
</script>
</@layout>